<script src="../../lib/jquery-1.7.1.js"></script>
<script src="../../src/tooltip/tooltip.js"></script>

<style>
body {
	font-family:sans-serif;		
	margin:50px;
}
.tooltip {
	background-color:#000;
	padding:5px;
	color:#fff;
}

a {
	margin:20px 0;		
}
</style>


<div style="position:relative; top:50px; left: 50px">
	<p>
		<a title="hello world">normally floated</a>
	</p>
	
	<div style="position:absolute; top: 100px; left: 100px">	
		<a title="hello world">inside absolute</a>
		
		<div style="position:relative; top: 100px; left: 300px">	
			<a title="hello world">nested absolute</a>	
		</div>
		
	</div>
	
	
	<div style="position:relative; top: 150px; left: 150px">	
		<a title="hello world">inside relative</a>
	
		<div style="position:relative; top: 50px; left: 50px">
			<a title="hello world">nested relative</a>		
		</div>
		
	</div>
</div>	

<script>
$("a").tooltip();
</script>
